import { ChangeDetectionStrategy, ChangeDetectorRef, Component, forwardRef, OnInit } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';

@Component({
  selector: 'app-sizer',
  templateUrl: './sizer.component.html',
  providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => SizerComponent),
      multi: true,
    },
  ],
  changeDetection:ChangeDetectionStrategy.OnPush
})
export class SizerComponent implements OnInit, ControlValueAccessor {
  size = 16;
  disabled = false;
  constructor(private cdr:ChangeDetectorRef) {}

  ngOnInit(): void {}
  inc(): void {
    this.size += 1;
    this.onChange(this.size);
  }
  dec(): void {
    this.size -= 1;
    this.onChange(this.size);
  }
  private onChange = (value: number) => {};
  private onTouched = () => {};
  writeValue(value: number): void {
    this.size = value;
    this.cdr.markForCheck();
  }
  registerOnChange(fn: (value: number) => void): void {
    this.onChange = fn;
  }
  registerOnTouched(fn: () => void): void {
    this.onTouched = fn;
  }
  //宿主绑定了disable属性，就会触发这个函数
  setDisabledState?(disabled: boolean): void {
    this.disabled = disabled;
  }
}
